<%@ page contentType="text/html; charset=utf-8"%>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">商品列表</h4>
      </div>
      <div class="modal-body">
      	<form class="form-inline" action="${ctx }/notice/push" id="defaultForm" method="post">
		<div class="form-group">
		    <label for="exampleInputName2">商品标题:</label>
		    <input type="text" class="form-control pt" name="title" placeholder="商品标题">
		 </div>
		  <button type="button" class="btn btn-info pt_search">查 询</button>
		</form>
      </div>
      <div class="modal-body">
        <table class="table table-hover">
      <thead>
         <tr>
         	<th>商品ID</th>
         	<th>商品名称</th>
         </tr>
      </thead>
      <tbody id="productcontent">
      		
      </tbody>
   </table>
      </div>
      <div id="foot">
	<div class="pagination"></div>
	</div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>
<script>

	var count = ${count};
	var obj = $("#productcontent");
	var currentpage = ${currentpage };
	onload_(0);
	
	function onload_(page){
		var pt = $(".pt").val();
	$.post(ctx+"/product/productlist",
			{page:page,
			 pt:pt
			},
			function(result){
		 currentpage = result.data.currentpage;
		 var array = result.data.productVo;
		 for(var i = 0 ; i < array.length ; i ++){
			 obj.append("<tr onclick='selectProduct(this)'><td>"+array[i].productId+"</td><td>"+array[i].productName+"</td></tr>");
		 }
		},"json");
	initpage(currentpage);
	}
	
	function initpage(currentpage){
		var initPagination = function() {
			$(".pagination").pagination(count, {
			num_edge_entries : 1,
			num_display_entries : 10,
			callback : pageselectCallback,
			items_per_page:10,
			current_page : currentpage
			});
			}();
	}

	function pageselectCallback(page_index, jq) {
		if(currentpage != page_index) {
			//$("#current_page").val(page_index);
			currentpage = page_index;
			obj.empty();
			onload_(page_index);
		}
		return false;
		} 
	
	function selectProduct(a){
		/* $(a).find("td").each(function(i){
		     alert($(this).text());
		  }); */
		var $tr = $(a).children('td');
		var productId = $tr.eq(0).text();
		var productName = $tr.eq(1).text();
		//$("input[name='productId']").val(productId);
		//$("input[name='productName']").val(productName) 
		createHtml(productId,productName);
	}	
	
	function createHtml(productId,productName){
		var html = "<div class=\"form-group\"><label for=\"firstname\" class=\"col-sm-2 control-label\"></label><div class=\"col-sm-6\"><input type=\"text\" class=\"form-control\" readonly=\"readonly\" value=\""+productName+">>>"+productId+"\" name=\"productName\"></div><div class=\"col-sm-1\"><button type=\"button\" class=\"btn btn-danger\" onclick='deleteData(this)'>删 除</button></div></div>";
		$(".tmp").after(html);
	}
	
	function deleteData(obj){
		$(obj).parent().parent().remove();
	}
	
	$(".pt_search").click(function(){
		var pt = $(".pt").val();
		obj.empty();
		onload_(0);
	});

</script>